<%-- 
    Document   : Albums
    Created on : Mar 25, 2013, 4:02:22 PM
    Author     : DinhNP
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<link href="css/block.css" type="text/css" rel="stylesheet"/>
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/commonjs.js"></script>
<script type="text/javascript">
    var xmlDoc;
    var xmlHttp;
    var byFeature = 1;
    var byDate=2;
    var byRandom=3;
    var noSorting = 4;
    var allAlbums;
    function displayAllBlockAlbums(){
        
        var path = "${pageContext.request.contextPath}/xml/Albums.xml";
        xmlDoc = loadXMLDoc(path);
        var albums = xmlDoc.getElementsByTagName("Album");
        allAlbums = [];

        for (var i=0;i<albums.length;i++){
            var albumID="";
            var albumTitle="";
            var artistID="";
            var artistName="";
            var albumCoverSRC="";
            var albumViews="";
            var albumDateCreated="";

            if (albums[i].getElementsByTagName("AlbumID")[0].firstChild!=null){
                albumID = albums[i].getElementsByTagName("AlbumID")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("AlbumTitle")[0].firstChild!=null){
                albumTitle = albums[i].getElementsByTagName("AlbumTitle")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("ArtistID")[0].firstChild!=null){
                artistID = albums[i].getElementsByTagName("ArtistID")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("ArtistName")[0].firstChild!=null){
                artistName = albums[i].getElementsByTagName("ArtistName")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("AlbumCoverSRC")[0].firstChild!=null){
                albumCoverSRC = albums[i].getElementsByTagName("AlbumCoverSRC")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("AlbumViews")[0].firstChild!=null){
                albumViews = albums[i].getElementsByTagName("AlbumViews")[0].firstChild.nodeValue.toString().trim();
            }
            if (albums[i].getElementsByTagName("AlbumDateCreated")[0].firstChild!=null){
                albumDateCreated = albums[i].getElementsByTagName("AlbumDateCreated")[0].firstChild.nodeValue.toString().trim();
            }
      
            allAlbums.push({
                albumID:albumID,
                albumTitle:albumTitle,
                artistID:artistID,
                artistName:artistName,
                albumCoverSRC:albumCoverSRC,
                albumViews : albumViews,
                albumDateCreated:albumDateCreated
            });
        }
        
        bubbleSortByViews(allAlbums);
        document.getElementById("output_hot_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS NỔI BẬT",8,byFeature) ;
        bubbleSortByDate(allAlbums);
        document.getElementById("output_lastest_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS MỚI NHẤT",8,byDate);
        document.getElementById("output_random_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS NGẪU NHIÊN", 8,byRandom);
    }
    function bubbleSortByViews(array){
        var i;
        var j;
        var temp;
        for(i=0; i<array.length-1; i++){
            for(j=i+1; j<array.length; j++){
                if(parseInt(array[j].albumViews) > parseInt(array[i].albumViews)){
                    temp = array[j];
                    array[j] = array[i];
                    array[i] = temp;
                }
            }
        }
    }
    function bubbleSortByDate(array){
        var i;
        var j;
        var temp;
        var date1;
        var date2;
        for(i=0; i<array.length-1; i++){
            for(j=i+1; j<array.length; j++){

                date1 = new Date(array[i].albumDateCreated.toString().substr(0, 10));
                date2 = new Date(array[j].albumDateCreated.toString().substr(0, 10));
                if ( date2>date1){
                    temp = array[j];
                    array[j] = array[i];
                    array[i] = temp;
                }
            }
        }
    }
    function displayOneBlockAlbum(array,tableName,numberOfAlbums, sortType){
        
        if (tableName.toString().toUpperCase().indexOf("NGẪU NHIÊN")!= -1){
            for (var i = array.length - 1; i > 0; i--) {
                var j = Math.floor(Math.random() * (i + 1));
                var temp = array[i];
                array[i] = array[j];
                array[j] = temp;
            }
        }
        
        if (Number(numberOfAlbums)>Number(array.length)){
            numberOfAlbums = Number(array.length);
        }
        var output="<ul class='list_content'>"
            +"<div class='list_content_header'>"+tableName+"</div>";

        for (var i=0;i<Number(numberOfAlbums);i++){

            var imgSRC = "db/"+array[i].artistName.removeDotCharacter()+"/Album/"+array[i].albumTitle.removeDotCharacter()+"/"+array[i].albumCoverSRC;
            if (array[i].albumCoverSRC=="" || !isFileExists(imgSRC) ){
                imgSRC = "img/DefaultAlbumCover.jpg"; //set Default album cover
            } 
            output += "<li class='item'>"
                +"<div class='item_img'>"
                +"<a href='musicplayer.jsp?id="+array[i].albumID+"&type=2'>"
                +"<img src='"+imgSRC+"'/>"
                +"</a>"
                +"</div>"
                +"<p class='first_title'>"
                +"<a href='musicplayer.jsp?id="+array[i].albumID+"&type=2'>"+array[i].albumTitle+"</a>"
                +"</p>"
                +"<p class='second_title'>"
                +"<a href='artist.jsp?ArtistID="+array[i].artistID+"'>"+array[i].artistName+"</a>"
                +"</p></li>";
        }// end for

        if (sortType!=null){
            if (sortType==4){
                output += "<div class='view_all' onclick='displayAlbumsByCondition("+sortType+")'><button onclick='displayAlbumsByCondition("+sortType+")'>Trở lại</button></div></ul>";
            }else output += "<div class='view_all' onclick='displayAlbumsByCondition("+sortType+")'><button onclick='displayAlbumsByCondition("+sortType+")'>Xem tất cả</button></div></ul>";
        }
        return output;
    }
    function displayAlbumsByCondition(sortType){
        if (allAlbums==null){
            return;
        }else {
            if (sortType!=null){
                if (Number(sortType)==1){
                    document.getElementById("output_lastest_albums").innerHTML = "";
                    document.getElementById("output_random_albums").innerHTML = "";
                    bubbleSortByViews(allAlbums);
                    document.getElementById("output_hot_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS NỔI BẬT",allAlbums.length,noSorting) ;
                    window.location.href="#output_hot_albums";
                }else if(sortType==2){
                    document.getElementById("output_hot_albums").innerHTML = "";
                    document.getElementById("output_random_albums").innerHTML = "";
                    bubbleSortByDate(allAlbums);
                    document.getElementById("output_lastest_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS MỚI NHẤT",allAlbums.length,noSorting) ;
                    window.location.href="#output_lastest_albums";
                }else if(sortType==3){
                    document.getElementById("output_hot_albums").innerHTML = "";
                    document.getElementById("output_lastest_albums").innerHTML = "";
                    document.getElementById("output_random_albums").innerHTML = displayOneBlockAlbum(allAlbums, "ALBUMS NGẪU NHIÊN",allAlbums.length,noSorting) ;
                    window.location.href="#output_random_albums";
                }else if(sortType==4){
                    displayAllBlockAlbums();
                }
            }
            return;
        }
    }

</script>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Xem albums</title>
    </head>
    <body onload="displayAllBlockAlbums()">

        <!-- Include TOP  -->
        <%@include file="masterpage_top.jsp" %>

        <!-- MAIN CONTENT  -->
        <div id="middle">
            <div id="middle_content">
                <div id="output_hot_albums"></div>
                <div id="output_lastest_albums"></div>
                <div id="output_random_albums"></div>
            </div>
        </div>

        <!-- Include BOTTOM  -->
        <%@include file="masterpage_bottom.jsp" %>
    </body>
</html>
